<template>
  <div class="app-container">
    <el-card class="box-card">
      <div
        slot="header"
        class="clearfix"
      >
        <span>添加快速招聘</span>
        <el-button
          style="float: right; padding: 0;margin-left:14px"
          type="text"
          @click="goTo('/fast/job')"
        >
          返回
        </el-button>
        <el-button
          style="float: right; padding: 0;"
          type="text"
          @click="onSubmit('form')"
          :disabled="issubmit"
        >
          保存
        </el-button>
      </div>
      <el-form
        ref="form"
        class="common-form"
        :model="form"
        label-width="120px"
        :rules="rules"
        :inline-message="true"
      >
        <el-form-item label="我想招聘" prop="jobname">
          <el-input v-model="form.jobname" />
        </el-form-item>
        <el-form-item label="店面名称" prop="comname">
          <el-input v-model="form.comname" />
        </el-form-item>
        <el-form-item label="联系人" prop="contact">
          <el-input v-model="form.contact" />
        </el-form-item>
        <el-form-item label="联系电话" prop="telephone">
          <el-input v-model="form.telephone" />
        </el-form-item>
        <el-form-item label="联系地址" prop="address">
          <el-input v-model="form.address" />
        </el-form-item>
        <el-form-item label="具体描述" prop="content">
          <el-input v-model="form.content" type="textarea" rows="8" />
        </el-form-item>
        <el-form-item label="有效期" prop="valid">
          <el-radio-group v-model="form.valid">
            <el-radio label="7">7天</el-radio>
            <el-radio label="15">15天</el-radio>
            <el-radio label="30">30天</el-radio>
            <el-radio label="0">长期</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="管理密码" prop="adminpwd">
          <el-input v-model="form.adminpwd" />
        </el-form-item>
        <el-form-item label="">
          <el-button type="primary" :disabled="issubmit" @click="onSubmit('form')">保存</el-button>
          <el-button @click="goTo('/fast/job')">返回</el-button>
        </el-form-item>
      </el-form>
    </el-card>
  </div>
</template>

<script>
import { fastJobAdd } from '@/api/fast_job'

export default {
  data () {
    return {
      issubmit: false,
      form: {
        jobname: '',
        comname: '',
        contact: '',
        telephone: '',
        address: '',
        content: '',
        valid: '',
        adminpwd: ''
      },
      rules: {
        jobname: [
          { required: true, message: '请填写我想招聘', trigger: 'blur' }
        ],
        comname: [
          { required: true, message: '请填写店面名称', trigger: 'blur' }
        ],
        contact: [
          { required: true, message: '请填写联系人', trigger: 'blur' }
        ],
        telephone: [
          { required: true, message: '请填写联系电话', trigger: 'blur' }
        ],
        address: [
          { required: true, message: '请填写联系地址', trigger: 'blur' }
        ],
        content: [
          { required: true, message: '请填写具体描述', trigger: 'blur' }
        ],
        valid: [
          { required: true, message: '请选择有效期', trigger: 'blur' }
        ],
        adminpwd: [
          { required: true, message: '请填写管理密码', trigger: 'blur' }
        ]
      }
    }
  },
  mounted() {
  },
  created() {
    this.fetchInfo()
  },
  methods: {
    fetchInfo () {

    },
    goTo (target) {
      this.$router.push(target)
    },
    onSubmit(formName) {
      const that = this
      that.issubmit = true
      const insertData = { ...this.form }
      this.$refs[formName].validate(valid => {
        if (valid) {
          fastJobAdd(insertData).then(response => {
            this.$message.success(response.message)
            setTimeout(function() {
              that.$router.push('/fast/job')
            }, 1500)
            return true
          })
            .catch(() => {
              that.issubmit = false
              return false
            })
        } else {
          that.issubmit = false
          return false
        }
      })
    }
  }
}
</script>

<style lang="scss" scoped>
  .el-input, .el-select, .el-cascader, .el-textarea {
    width: 450px;
  }
</style>
